import Vue from "vue";

import App from "./App.vue";

import VueRouter from "vue-router";
import Layout from "./Layout.vue";
import HomeIndex from "./HomeIndex.vue";
import ShopIndex from "./ShopIndex.vue";
import ShopDetail from "./ShopDetail.vue";
import ShopList from "./ShopList.vue";
import UserIndex from "./UserIndex.vue";

Vue.use(VueRouter); //插件

const router = new VueRouter({
  mode: "hash",
  routes: [
    {
      path: "/home",
      name: "Home",
      component: Layout,
      redirect: { name: "HomeIndex" },
      children: [{ path: "index", name: "HomeIndex", component: HomeIndex }],
    },
    {
      path: "/shop",
      name: "Shop",
      component: Layout,
      redirect: { name: "ShopIndex" },
      beforeEnter(to, from, next) {
        console.log(to);
        console.log("beforeEnter", "路由独享");
        next();
      },
      children: [
        { path: "index", name: "ShopIndex", component: ShopIndex },
        { path: "detail", name: "ShopDetail", component: ShopDetail },
        { path: "list", name: "ShopList", component: ShopList },
      ],
    },
    {
      path: "/user",
      name: "User",
      component: Layout,
      redirect: { name: "UserIndex" },
      children: [{ path: "index", name: "UserIndex", component: UserIndex }],
    },
  ],
});

router.beforeEach(function (to, from, next) {
  console.log("beforeEach", "全局前置");
  next();
  if (to.name === "UserIndex") {
    // next(false);
    // next(new Error("请先登录!"));
    // next({ name: "HomeIndex" });
  } else {
    // next(); //放行
  }
});

router.beforeResolve(function (to, from, next) {
  console.log("beforeResolve", "全局解析");
  next(); //放行
});

router.afterEach(function (to, from) {
  console.log("afterEach", "全局后置");
});

new Vue({
  render: (h) => h(App),
  router, //路由注入
}).$mount("#app");
